body{
	background: #efefef;
}
/*body>div{
	margin:.5rem 1rem;
}*/
.rt{
	float:right;
}
/*  按钮样式  */
.btn-group button i:before{
    padding-right: .5rem;
}
.input-group span.input-group-btn button span{
	padding:3px 0;
}
div.btn-group .fa-caret-down:before{
padding-left: .5rem;
}
.form-control,button.btn{
	height:3rem;
}
.btn-group-xs>.btn,button.btn.btn-xs {
    padding: 1px 5px;
    font-size: 12px;
    line-height: 1.5;
    border-radius: 3px;
	height: auto;
}
.btn-group-sm>.btn,button.btn.btn-sm {
    padding: 5px 10px;
    font-size: 12px;
    line-height: 1.5;
    border-radius: 3px;
	height: auto;
}
.btn-group-lg>.btn,button.btn.btn-lg {
    padding: 10px 16px;
    font-size: 18px;
    line-height: 1.3333333;
    border-radius: 6px;
	height: auto;
}
/*  段落字体框  */
.box-body {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px;
    padding: 10px;
    display: block;
}
/*  复选框、单选框按钮  */

.box-style.fa:before{
     padding: .5rem .5rem;
     font-size: 1.6rem;
     vertical-align: middle;
     display: inline-block;
     width: 2.5rem;
}
.font-green{
      color: #00a65a;
}
.font-orange{
       color: #ff851b;
}
.box-style{
	position: relative;
    display: block;
    margin-top: 10px;
    margin-bottom: 10px;
}
.box-style span{
	vertical-align: middle;
}
.info-box-icon .fa-google-plus{
	 line-height: inherit;
}
.ion-ios-heart-outline:before{
	line-height:90px;
}
.product-img img{
	width:10rem;
}
/* button内图片文字 */
i#TopDown{
    display: block;
}
button.btn.layoutbtn{
	height:auto;
}
button.btn.layoutbtn img{
	width:6rem;
	padding: .5rem 0;
}
i#TopDown,img#TopDown,i#downTop,img#DownTop{
    display: block;
}
i#DownTop{
     padding-top: 2rem;
     margin-bottom: -3rem;
}
img#DownTop{
      margin-top: 2rem;
     margin-bottom: -7rem;
}
i#DownTop+span,img#DownTop+span{
     display: block;
}
i#DownTop+span{
     margin-bottom: 2rem;
}
img#DownTop+span{
    margin-bottom: 6rem;
}
.fa:before{
	padding:0 .3rem;
}
.box.box-solid{
    border-radius: .2rem;
	    color: #444;
     padding:1rem .5rem;
}
/*toggle */
.lcs_switch {
            display: inline-block;
            position: relative;
            width: 73px;
            height: 28px;
            border-radius: 30px;
            background: #ddd;
            overflow: hidden;
            cursor: pointer;
            -webkit-transition: all .2s ease-in-out;
            -ms-transition: 	all .2s ease-in-out;
            transition: 		all .2s ease-in-out;
}
.lcs_cursor {
            display: inline-block;
            position: absolute;
            top: 3px;
            width: 22px;
            height: 22px;
            border-radius: 100%;
            background: #fff;
            box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2), 0 3px 4px 0 rgba(0, 0, 0, 0.1);
            z-index: 10;
            -webkit-transition: all .2s linear;
            -ms-transition: 	all .2s linear;
            transition: 		all .2s linear;
}
.lcs_label {
            font-family: "Trebuchet MS", Helvetica, sans-serif;
            font-size: 12px;
            letter-spacing: 1px;
            line-height: 18px;
            color: #fff;
            font-weight: bold;
            position: absolute;
            width: 33px;
            top: 5px;
            overflow: hidden;
            text-align: center;
            display: none;
            -webkit-transition: all .2s ease-in-out .1s;
            -ms-transition: 	all .2s ease-in-out .1s;
            transition: 		all .2s ease-in-out .1s;
}
.lcs_label.lcs_label_on {
            left: -35px;
            z-index: 6;
}
.lcs_label.lcs_label_off {
            right: -35px;
            z-index: 5;
}
/* on */
 .lcs_switch.lcs_on {
            background: #75b936;
            box-shadow: 0 0 2px #579022 inset;
}
.lcs_switch.lcs_on .lcs_cursor {
            left: 48px;
}
.lcs_switch.lcs_on .lcs_label_on {
            left: 10px;
            display: block;
}
/* off */
.lcs_switch.lcs_off {
            background: #b2b2b2;
            box-shadow: 0px 0px 2px #a4a4a4 inset;
}
.lcs_switch.lcs_off .lcs_cursor {
            left: 3px;
}
.lcs_switch.lcs_off .lcs_label_off {
            right: 10px;
            display: block;
}
/* disabled */
.lcs_switch.lcs_disabled {
            opacity: 0.65;
            filter: alpha(opacity=65);
            cursor: default;
}
.fa{
	vertical-align: middle;
}
/* text+ icon +input */
.fixedbox-input{
			width: 100%;
            position: relative;
            height: 2.5em;
			margin: 0 auto;
}
.inputstyle{
			width:100%;
            height: 2.5em;
            font-size: 14px;
            line-height: 1.42857143;
            color: #555;
            background-color: #fff;
            border: 1px solid #ccc;
}
.fixedbox-input>span.beforespan,
.fixedbox-input>span.afterspan{
			border: 1px solid #ccc;
			height: 2.5em;
            line-height: 2.5em;
            display: inline-block;
            padding: 0 .8em;
			text-align: center;
			white-space: nowrap;
			background: #fff;
}
.fixedbox-input>span.beforespan{
			border-right:0;
			border-radius: 4px 0 0 4px;
}
.fixedbox-input>span.beforespan>i.beforei,.fixedbox-input>span.afterspan>i.afteri{
	    height: 2.5em;
		line-height: 2.5em;
		margin-top: -1px;
}
.fixedbox-input>span.afterspan{
			border-left:0;
			border-radius: 0 4px 4px 0;
}

.built-in-box{
            display: inline-block;
            position: relative;
            vertical-align: bottom;
			padding: 0;
}
.built-in-box>i{
            padding: 0 8px;
            position: absolute;
            height: 2.5em;
            line-height: 2.5em;
}

.built-in-box>i.beforefloati{
            left: 0;
}
.built-in-box>i.beforefloati+.inputstyle{
	padding-left:2em;
}
.built-in-box>i.afterfloati{
            right: 0;
            top: 0;
}
/* tip  */
.hiddentip,.showtip{
	position: absolute;
	padding: 0 3rem;
	line-height: 2em;
	background: #fff;
	border-radius: 4px;
	z-index: 100;
	display:none;
}
*>.showtip,
div:hover .hiddentip{
	display:block;
}
.tipsouth{
    top: 3.22em;
    left: 0;
    border: 1px solid #00c0ef;
}
.tipnorth{
    bottom: 3.22em;
    left: 0;
    border: 1px solid #e44949;
}
.tipwest{
    top: 0;
    right: 100%;
    border: 1px solid #e44949;
	margin-right: 6px;
}
.tipeast{
    top: 0;
    left: 100%;
    /*border: 1px solid #e44949;*/
	margin-left: 6px;
}
.triangle{
	position: absolute;
	z-index: 110;
}
/* 向上三角  */
.south,.north{
	border-left: 6px solid transparent;
    border-right: 6px solid transparent;
	left: 50%;
	margin-left: -.4em;
}
.south{
    border-bottom: 6px solid #00c0ef;
    top: -0.5em;
}
.north{
    border-top: 6px solid #191919;
    bottom: -0.5em;
}
.west,.east{
border-top: 6px solid transparent;
    border-bottom: 6px solid transparent;
	top: 50%;
    margin-top: -.4em;
}
.west{
    border-left: 6px solid #e44949;
    right: -0.5em;
}   
.east{
    border-right: 6px solid #f39c12;
    left: -0.5em;
} 
/* pop  */
.popbox{
            width: 100%;
            height: 100%;
            background: rgba(0,0,0,.3);
            position: absolute;
            top: 0;
            left: 0;
}
.pop{
            width: 29rem;
            min-height: 12.8rem;
            background: #fff;
            border-radius: .5rem;
            position: absolute;
            left: 50%;
            margin-left: -14.5rem;
            top:30%;
            padding-top: 2rem;
}
.pop-close{
            position: absolute;
            right: 0;
            top:0;
            color: #ccc;
            cursor: pointer;
            padding:.9rem
}
.pop-title,.pop-describe{
            text-align: center;
}
.pop-title{
            color:#f39c12;
            display: block;
            font-size: 1.8rem;
            padding: 1.5rem .9rem;
}
.pop-title.fa:before{
            padding-right: .9rem;
}
.pop-describe{
            color:#666;
            padding:0 1.5rem;
            overflow: hidden;
            text-overflow: ellipsis;
            display: -webkit-box;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
}
.box-btn{
            position: absolute;
            bottom: 0;
            width: 100%;
            height: 2.85rem;
            line-height: 2.85rem;
}
.box-btn>span{
            display: inline-block;
            text-align: center;
            width: 100%;
            background: #f0f0f0;
            cursor: pointer;
}
.box-btn>span.active{
            background: #ffd777;
            color: #fff;
}
.box-btn>span:first-child{
            border-radius: 0 0 0 .5rem;
}
.box-btn>span:last-child{
            border-radius: 0 0 .5rem 0;
}
.box-btn .confirm-btn:hover{
            background: #f39c12;
}
.return-btn:hover{
            background: #989898;
            color: #fff;
}
.pop-close:hover{
            color: #f39c12;
}
.average{
            display: flex;
            justify-content: space-around;
}

/*primary 科技互联网稳重色值class*/
.primary-border{
    border:1px solid #3c8dbc;
}
.bg-primary{
     background:#3c8dbc;
     color: #fff;
}
.bg-lprimary{
      background:#80b5d3;
}
.font-primary{
      color: #3c8dbc;
}
.bg-primary:hover{
      background:#357ca5;
}
.bg-lprimary:hover{
      background:#3c8dbc;
}
/*warning提醒类色值class*/
.border-warning{
border:1px solid #f39c12;
}
.bg-warning{
      background:#f39c12;
     color: #fff;
}
.bg-lwarning{
      background:#f7bf65;
}
.font-warning{
      color: #f39c12;
}
.bg-warning:hover{
      background:#db8b0b;
	color:#fff;
}
.bg-lwarning:hover{
      background:#f39c12;
	color:#fff;
}
/*success成功显示类色值class*/
.border-success{
     border:1px solid #00a65a;
}
.bg-success{
     background:#00a65a;
     color: #fff;
}
.bg-lsuccess{
     background:#5ac594;
}
.font-success{
      color: #00a65a;
}
.bg-success:hover{
      background:#008d4c;
	color:#fff;
}
.bg-lsuccess:hover{
      background:#00a65a;
	color:#fff;
}
/*danger重要提醒类色值class*/
.border-danger{
      border:1px solid #dd4b39;
}
.bg-danger{
      background:#dd4b39;
      color: #fff;
}
.bg-ldanger{
     background:#e98a7e;
}
.font-danger{
    color: #dd4b39;
}
.bg-danger:hover{
    background:#d33724;
	color:#fff;
}
.bg-ldanger:hover{
     background:#dd4b39;
	 color:#fff;
}
/*purple VIP高贵神秘类色值class*/
.border-purple{
     border:1px solid #605ca8;
}
.bg-purple{
     background:#605ca8;
     color: #fff;
}
.bg-lpurple{
     background:#9895c6;
}
.font-purple{
     color: #605ca8;
}
.bg-purple:hover{
    background:#555299;
	color:#fff;
}
.bg-lpurple:hover{
    background:#605ca8;
	color:#fff;
}

/*info 色值class*/
.border-info{
     border:1px solid #00c0ef;
}
.bg-info{
     background:#00c0ef;
     color: #fff;
}
.bg-linfo{
     background:#5ad6f4;
}
.font-info{
     color: #00c0ef;
}
.bg-info:hover{
    background:#00a7d0;
	color:#fff;
}
.bg-linfo:hover{
    background:#00c0ef;
	color:#fff;
}
/*gray 浅色值class*/
.border-gray2{
     border:1px solid #d2d6de;
}
.bg-gray2{
     background:#d2d6de;
     color: #333;
}
.bg-lgray2{
     background:#e2e4e9;
}
.font-gray2{
     color: #d2d6de;
}
.bg-gray2:hover{
    background:#b5bbc8;
	color:#fff;
}
.bg-lgray2:hover{
    background:#d2d6de;
	color:#fff;
}
/*gray 色值class*/
.border-gray{
     border:1px solid #666;
}
.bg-gray{
     background:#666;
     color: #fff;
}
.bg-lgray{
     background:#9c9c9c;
}
.font-gray{
     color: #666;
}
.bg-gray:hover{
    background:#333;
	color:#fff;
}
.bg-lgray:hover{
    background:#666;
	color:#fff;
}
/* 深灰黑色 色值class*/
.bg-grayblack{
	background:#191919;
	color:#fff;
}
.border-grayblack{
	border:1px solid #191919;
}
.font-white{
	color:white;
}

/*透明 色值class*/
.bg-transparent{
	background: transparent;
}